<%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
<script type="text/javascript">
var systemAccessDataGrid = $('#systemaccess-datagrid-json').datagrid({
    gridTitle : '系统模块管理',
    showToolbar: true,
    toolbarCustom: function(){
		return '<div class="btn-group" role="group"><button type="button" class="btn btn-blue" onclick="addSystemAccess()"><i class="fa fa-plus"></i> 添加</button></div>' +
       	       '<div class="btn-group" role="group"><button type="button" class="btn btn-green" onclick="refreshSystemAccess()"><i class="fa fa-refresh"></i> 刷新</button></div>';
    },
    filterThead: false,
    filterAll: true,
    showLinenumber: false,
    sortAll: true,
    dataUrl: 'systemAccess/list.do',
    dataType: 'json',
    columns: [
        {
			name: 'showStatus',
			label: '操作',
			align: 'center',
			width: 220,
			quicksort:false,
			menu: false,
			edit: false,
			render: function(value){
    			var tool = '';
   				   //判断启用状态 如果是已启用 就不显示 修改删除 启用标识显示为关闭
   				if(value == '1'){
   					tool += '<div class="btn-group" role="group"><button disabled type="button" class="btn btn-blue btn-disable btn-sm" ><i class="fa fa-edit"></i> 编辑</button></div> ';
   					tool += '<div class="btn-group" role="group"><button disabled type="button" class="btn btn-red btn-disable btn-sm" ><i class="fa fa-remove"></i> 删除</button></div> ';
   					tool += '<div class="btn-group" role="group"><button type="button" class="btn btn-orange btn-sm" onclick="showOrNot(this,\'close\')"><i class="fa fa-edit"></i> 停用</button></div> ';
	    		}else{
	    			tool += '<div class="btn-group" role="group"><button type="button" class="btn btn-blue btn-sm" onclick="editSystemAccess(this)"><i class="fa fa-edit"></i> 编辑</button></div> ';
   					tool += '<div class="btn-group" role="group"><button type="button" class="btn btn-red btn-sm" onclick="deleteSystemAcccess(this)"><i class="fa fa-remove"></i> 删除</button></div> ';
   					tool += '<div class="btn-group" role="group"><button type="button" class="btn btn-green btn-sm" onclick="showOrNot(this,\'open\')"><i class="fa fa-edit"></i> 启用</button></div> ';
		    	}
    			return tool;
			}
        },
        {
            name: 'systemName',
            label: '系统名称',
            align: 'center',
            width: 150
        },
        {
            name: 'systemId',
            label: '系统编号',
            align: 'center',
            width: 80
        },
        {
            name: 'accessUrl',
            label: '接入地址',
            align: 'center',
            width: 340,
            rule: 'length[~200]'
        },
        {
            name: 'showIndex',
            label: '显示顺序',
            align: 'center',
            width: 80
        },
        {
            name: 'iconBig',
            label: '系统图标(大)',
            align: 'center',
            width: 100,
            render: function(value) {
                if(value){
	                return '<img src="'+value+'" style="width: 50px; height: 50px;"/>';
                }else{
				    return "";
                }
            }
        },
        {
            name: 'iconSmall',
            label: '系统图标(小)',
            align: 'center',
            width: 100,
            render: function(value) {
            	if(value){
	                return '<img src="'+value+'" style="width: 50px; height: 50px;"/>';
                }else{
				    return "";
                }
            }
        },
        {
            name: 'width',
            label: '宽度',
            align: 'center',
            width: 50
        },
        {
            name: 'height',
            label: '高度',
            align: 'center',
            width: 50
        },
        {
            name: 'showStatus',
            items: [{'1':'是'}, {'0':'否'}],
            label: '是否启用',
            width: 80,
            rule: 'required;length(1)',
            type : "select",
            align: 'center',
            render: $.datagrid.renderItem
        },
        {
            name: 'permissionType',
            items: [{'1':'集中管理'}, {'2':'独立管理'}],
            label: '权限模式',
            width: 80,
            rule: 'required;length(1)',
            type : "select",
            align: 'center',
            render: $.datagrid.renderItem
        }
    ],
    paging: {pageSize:20, selectPageSize:'20,30,40'},
    showTfoot: true,
    fullGrid: false
});

try {
	systemAccessDataGrid.data('bjui.datagrid').colLock(0, true);
} catch (e) {}

function refreshSystemAccess() {
	systemAccessDataGrid.datagrid("refresh");
}

function addSystemAccess() {
	$('#edit-systemaccess-dialog').dialog({
		id:'edit-systemaccess-dialog', 
		url:'systemAccess/edit.do', 
		maxable: false,
		mask: true,
		resizable:false,
		width: 850,
		height: 500,
		onLoad: function($dialog){
			setEditSystemAccessBtnEvent($dialog, true);
		},
		title:'添加系统模块'});
}

/* 启用转态改变 */
function showOrNot(_btn,show){
	var systemAccessIndex = $(_btn).closest("tr").index();
	var rowData = systemAccessDataGrid.data('bjui.datagrid').getRowData(systemAccessIndex);
	var str = "";
	if(show=="close"){
		str = "停用";
	}else{
		str = "启用";
	}
	$('#edit-systemaccess-dialog').alertmsg('confirm', '确定'+str+'当前数据？', 
		{
		    displayMode:'slide', 
            okName:'确定', 
            cancelName:'取消', 
            title:'提示信息',
            okCall : function(){
            	var url = "systemAccess/changeShow.do?id="+rowData.systemAccessId+"&show="+show;
        		var data = null;
        		var successCallBack = function(result){
        			refreshSystemAccess();
        		}
        		var failCallBack = null;
        		var errorCallBack = null;
        		myAjax(url, data, true, successCallBack, failCallBack, errorCallBack);
            }
		}
	);	
}

/* 删除 */
function deleteSystemAcccess(_btn){
	var systemAccessIndex = $(_btn).closest("tr").index();
	var rowData = systemAccessDataGrid.data('bjui.datagrid').getRowData(systemAccessIndex);

	$('#edit-systemaccess-dialog').alertmsg('confirm', '确定删除当前数据？', 
		{
		    displayMode:'slide', 
            okName:'确定', 
            cancelName:'取消', 
            title:'提示信息',
            okCall : function(){
               	var url = "systemAccess/delete.do?id="+rowData.systemAccessId;
           		var data = null;
           		var successCallBack = function(result){
           			refreshSystemAccess();
           		}
           		var failCallBack = null;
           		var errorCallBack = null;
           		myAjax(url, data, true, successCallBack, failCallBack, errorCallBack);
            }
	 	}
	);
}

function editSystemAccess(_btn) {
	var systemAccessIndex = $(_btn).closest("tr").index();
	var data = systemAccessDataGrid.data('bjui.datagrid').getRowData(systemAccessIndex);
	$('#edit-systemaccess-dialog').dialog({
		id:'edit-systemaccess-dialog', 
		url:'systemAccess/edit.do', 
		maxable: false,
		mask: true,
		resizable:false,
		width: 850,
		height: 500,
		onLoad: function($dialog){
			setEditSystemAccessBtnEvent($dialog, false);
			getJsonData2Form('systemAccess/getSystemAccess.do', 'id='+ data.systemAccessId, $('#systemaccess_form'), systemAccessCallback);
		},
		title:'编辑系统模块'});
}
function systemAccessCallback($inputObj, _name, _val){
	if(_name == "iconBig" && _val){
		$('#iconBig_span_pic').html('已上传图片：<img src="'+ _val +'" width="200">');
	} else if(_name == "iconSmall" && _val){
		$('#iconSmall_span_pic').html('已上传图片：<img src="'+ _val +'" width="200">');
	} 

	$("#systemaccess_form").find("input:[name='systemId']").attr("readonly","readonly");
}

function setEditSystemAccessBtnEvent($dialog, isAdd) {
	var $prev, $next, $save, $cancel;
	$save = $dialog.find('.save');
	$cancel = $dialog.find('.cancel');
	$save.click(function(){
		$('#systemaccess_form').isValid(function(v) {
			if(v){
				var url = 'systemAccess/save.do';
				var data = $('#systemaccess_form').serialize()+"&addFlag="+isAdd;
				var successCallBack = function(result){
					$dialog.dialog('closeCurrent');
					refreshSystemAccess();
				}
				var failCallBack = null;
				var errorCallBack = null;
				myAjax(url, data, true, successCallBack, failCallBack, errorCallBack);
			}
		});
	});
	
	$cancel.click(function(){
		$dialog.dialog('closeCurrent');
	});
}
</script>
<div class="bjui-pageContent">
    <div style="padding:0px; height:100%; width:100%;">
        <table id="systemaccess-datagrid-json" data-width="100%" data-height="100%" class="table table-bordered">
        </table>
    </div>
</div>
<div id="edit-systemaccess-dialog" style="display: none;">
</div>